import { inject, onMounted } from "vue"
import { mapStore } from "@/store"

export const realOK = () => {
    const store = mapStore()
    let map
    onMounted(() => {
        map = inject('$map')
    })

    const addOK = () => {
        store.isAdded = false
        let layers = map.getStyle().layers
        let newFeature = layers.reverse()[0]
        let features = map.queryRenderedFeatures({ layers: [newFeature.id] });
        features.forEach(feature => {
            feature.properties.name = store.event_name; // 添加新属性
            feature.properties.id = store.event_id; // 添加新属性
            feature.properties.level = store.event_level; // 添加新属性
            feature.properties.car_num = store.event_car_num; // 添加新属性
            feature.properties.driver = store.event_driver; // 添加新属性
            feature.properties.area = store.event_area; // 添加新属性
            // 更新数据源
            map.getSource(newFeature.id).setData(feature);
        })
    }
    const notAdd = () => {
        store.isAdded = false
        const layers = map.getStyle().layers
        const layer = layers.reverse()
        map.removeLayer(layer[0].id)
    }

    return {
        addOK,
        notAdd,
    }
}